<template>
  <!-- <lb-layout> -->
  <div class="table-content1">
    <el-row>
      <el-col :span="24">
        <el-form
          :model="queryParams"
          ref="queryForm"
          size="small"
          :inline="true"
        >
          <!-- <el-form-item prop="organizationStructureCode">
            <el-autocomplete
              class="inline-input"
              size="small"
              v-model="queryParams.organizationStructureCode"
              v-hasPermi="['system:institutions:list']"
              :fetch-suggestions="
                ($value, $event) => {
                  this.querySearch($value, $event, 'organiz');
                }
              "
              placeholder="请输入公共组织结构编码"
              :trigger-on-focus="false"
              @select="handleSelect"
            ></el-autocomplete>
          </el-form-item> -->
          <el-form-item prop="unifiedSocialCreditCode">
            <el-autocomplete
              class="inline-input"
              size="small"
              v-model="queryParams.unifiedSocialCreditCode"
              v-hasPermi="['system:institutions:list']"
              :fetch-suggestions="
                ($value, $event) => {
                  this.querySearch($value, $event, 'social');
                }
              "
              placeholder="请输入信用代码"
              :trigger-on-focus="false"
              @select="handleSelect"
            ></el-autocomplete>
          </el-form-item>
          <el-form-item prop="companyName">
            <el-autocomplete
              class="inline-input"
              size="small"
              v-model="queryParams.companyName"
              v-hasPermi="['system:institutions:list']"
              :fetch-suggestions="
                ($value, $event) => {
                  this.querySearch($value, $event, 'companyName');
                }
              "
              placeholder="请输入单位名称"
              :trigger-on-focus="false"
              @select="handleSelect"
            ></el-autocomplete>
          </el-form-item>
          <el-form-item prop="month">
            <el-date-picker
              v-model="queryParams.month"
              type="month"
              placeholder="选择年月"
              value-format="yyyy-MM"
              :picker-options="pickerOptions"
              :clearable="false"
              @change="choseMonth"
            >
            </el-date-picker>
          </el-form-item>
          <el-form-item>
            <el-button
              type="primary"
              icon="el-icon-search"
              size="small"
              v-hasPermi="['system:institutions:list']"
              @click="handleQuery"
            >
              搜索
            </el-button>
            <el-button
              icon="el-icon-refresh"
              size="small"
              v-hasPermi="['system:institutions:list']"
              @click="handleresetQuery"
            >
              重置
            </el-button>
            <!-- 按钮状态  reporting_status -1 未有数据 0 未提交  1 区县待审核  2 地市待审核 3 审核成功 4 上报成功 5 区县审核失败   6地市审核失败-->
            <el-button
              type="primary"
              icon="el-icon-download"
              size="small"
              plain
              v-show="readyStaus == 0 || readyStaus == -1"
              v-hasPermi="['energy:institutions:edit']"
              @click="handleSave(1)"
            >
              保存
            </el-button>
            <el-button
              type="primary"
              icon="el-icon-upload2"
              size="small"
              plain
              v-show="readyStaus == 0"
              v-hasPermi="['energy:institutions:edit']"
              @click="handleUp"
            >
              提交
            </el-button>
            <el-button
              type="primary"
              icon="el-icon-document-checked"
              size="small"
              v-show="
                (readyStaus == 1 && administrativeDivision == '2') ||
                (readyStaus == 2 && administrativeDivision == '1') ||
                ((readyStaus == 1 || readyStaus == 2) && userId === 1)
              "
              v-hasPermi="['energy:institutions:audit']"
              @click="handleImport"
            >
              审核
            </el-button>
            <!-- 审核失败 填报人确认按钮 -->
            <el-button
              type="primary"
              icon="el-icon-document-checked"
              size="small"
              v-show="readyStaus == 5 || readyStaus == 6"
              v-hasPermi="['energy:institutions:confirm']"
              @click="handleConfirm"
            >
              确认
            </el-button>
            <el-button
              type="primary"
              icon="el-icon-top"
              size="small"
              v-show="readyStaus == 3"
              v-hasPermi="['system:institutions:add']"
              @click="handleReport"
            >
              上报
            </el-button>
            <el-button
              type="primary"
              icon="el-icon-receiving"
              size="small"
              plain
              v-show="readyStaus == 4"
              v-hasPermi="['system:institutions:export']"
              @click="handlePrint"
              v-print="printObj"
            >
              打印
            </el-button>
            <el-button
              icon="el-icon-right"
              size="small"
              v-show="readyStaus == 4"
              v-hasPermi="['system:institutions:export']"
              @click="handleExport"
            >
              导出
            </el-button>
          </el-form-item>
        </el-form>
      </el-col>
    </el-row>
    <el-row ref="monthFormTable" id="month-form-table">
      <el-col :span="24">
        <el-form
          :model="listform"
          size="small"
          ref="monthform"
          :rules="listRules"
        >
          <el-row>
            <el-col :span="24" class="table-title-area">
              <span class="table-title">公共机构能源资源消费状况</span>
            </el-col>
          </el-row>
          <el-row>
            <el-col :span="8">
              <el-row style="margin-left: 20px">
                <el-col :span="24" class="single-label single-down">
                  <div class="down-label">
                    <el-form-item label="(单位盖章):"></el-form-item>
                  </div>
                </el-col>
              </el-row>
            </el-col>
            <el-col :span="8">
              <el-row>
                <el-col :span="24" class="single-label single-down">
                  <div class="down-label">
                    <el-form-item
                      :label="year + '年'"
                      label-width="80px"
                    ></el-form-item>
                  </div>
                </el-col>
              </el-row>
            </el-col>
            <el-col :span="8">
              <el-row>
                <el-col :span="24" class="single-label">
                  <el-form-item label="表号:" label-width="120px">
                    <span>{{ headForm.tableCode }}</span>
                  </el-form-item>
                </el-col>
              </el-row>
              <el-row>
                <el-col :span="24" class="single-label">
                  <el-form-item label="制定机关:" label-width="120px">
                    <span>{{ headForm.enactingOrgan }}</span>
                  </el-form-item>
                </el-col>
              </el-row>
              <el-row>
                <el-col :span="24" class="single-label">
                  <el-form-item label="批准机关:" label-width="120px">
                    <span>{{ headForm.approvalOrgan }}</span>
                  </el-form-item>
                </el-col>
              </el-row>
              <el-row>
                <el-col :span="24" class="single-label">
                  <el-form-item label="批准文号:" label-width="120px">
                    <span>{{ headForm.approvalDocumentNum }}</span>
                  </el-form-item>
                </el-col>
              </el-row>
              <el-row>
                <el-col :span="24" class="single-label">
                  <el-form-item label="有效期至:" label-width="120px">
                    <span>{{ headForm.periodOfValidity }}</span>
                  </el-form-item>
                </el-col>
              </el-row>
            </el-col>
          </el-row>
          <!-- <lb-layout> -->
          <!-- max-height="300" -->
          <el-row>
            <el-col :span="24">
              <el-table
                :data="listform.list"
                style="width: 100%; margin-bottom: 20px"
                row-key="code"
                border
                default-expand-all
                :tree-props="{
                  children: 'children',
                  hasChildren: 'hasChildren',
                }"
              >
                <el-table-column label="指标名称" align="center">
                  <el-table-column
                    prop="name"
                    label="甲"
                    align="center"
                  ></el-table-column>
                </el-table-column>
                <el-table-column label="计量单位" align="center">
                  <el-table-column
                    prop="unit"
                    label="乙"
                    align="center"
                    width="200"
                  ></el-table-column>
                </el-table-column>
                <el-table-column label="代码" align="center">
                  <el-table-column
                    prop="code"
                    label="丙"
                    align="center"
                    width="200"
                  >
                  </el-table-column>
                </el-table-column>
                <el-table-column label="数量" align="center">
                  <el-table-column prop="value" label="丁" align="center">
                    <template slot-scope="scope">
                      <el-form-item class="cellCenter">
                        <span
                          v-if="
                            readyStaus == 1 ||
                            readyStaus == 2 ||
                            readyStaus == 3 ||
                            readyStaus == 4 ||
                            readyStaus == 5
                          "
                        >
                          {{ scope.row.value }}
                        </span>
                        <el-input
                          size="small"
                          type="number"
                          v-model.number="scope.row.value"
                          @input="handleInput"
                          v-else
                        >
                        </el-input>
                      </el-form-item>
                    </template>
                  </el-table-column>
                </el-table-column>
              </el-table>
            </el-col>
          </el-row>
          <el-row>
            <el-col :span="4" class="tip-area" :offset="2">
              <el-form-item label="单位负责人:">
                <el-input
                  size="small"
                  style="width: 80px"
                  v-model="listform.principalUnit"
                  readonly
                ></el-input>
              </el-form-item>
            </el-col>
            <el-col :span="4" class="tip-area">
              <el-form-item label="统计负责人:">
                <el-input
                  size="small"
                  style="width: 80px"
                  v-model="listform.principalStatistics"
                  readonly
                ></el-input>
              </el-form-item>
            </el-col>
            <el-col :span="4" class="tip-area">
              <el-form-item label="制表人:">
                <el-input
                  size="small"
                  style="width: 80px"
                  v-model="listform.formPepole"
                  readonly
                ></el-input>
              </el-form-item>
            </el-col>
            <el-col :span="5" class="tip-area">
              <el-form-item label="联系电话:">
                <el-input
                  size="small"
                  style="width: 120px"
                  v-model="listform.phone"
                  readonly
                ></el-input>
              </el-form-item>
            </el-col>
            <el-col :span="5" class="tip-area">
              <el-form-item label="填报日期:">
                <el-input
                  size="small"
                  style="width: 140px"
                  v-model="listform.date"
                  readonly
                ></el-input>
              </el-form-item>
            </el-col>
          </el-row>
          <el-row style="margin-top: 20px">
            <el-col :span="24">
              <el-row>
                <el-col :span="24">
                  <span class="explain">说明:</span>
                </el-col>
              </el-row>
              <el-row>
                <el-col :span="24">
                  <span class="explain">{{ explain }}</span>
                </el-col>
              </el-row>
            </el-col>
          </el-row>
          <!-- </lb-layout> -->
        </el-form>
      </el-col>
    </el-row>
    <!-- <component
      :is="modelName"
      :id="id"
      :visible.sync="show"
      @close="close"
    ></component> -->
    <Check
      :visible.sync="checkVisible"
      :checkId="checkId"
      :verifyMessage="verifyMessage"
      :checkWay="'month'"
      :checkMonth="queryParams.month"
    />
    <!-- :monthEmeterReqVoList="monthEmeterReqVoList" -->
  </div>
  <!-- </lb-layout> -->
</template>

<script>
import bulk from "@/views/work/standingbook/components/bulkimport.vue";
import Check from "@/views/work/standingbook/components/check.vue";
import { exportExecl } from "@/utils/export-execl";
import tableConst from "@/views/work/standingbook/month/components/tableConst";
import print from "vue-print-nb";
import {
  postInstitutionslist,
  postSelectins,
  postTabdata,
  postAddsave,
  postSubmit,
  postAuditdetail,
  postConfirm,
  postReport,
} from "@/api/standingbook/month.js";
import {
  deepClone,
  replaceInteger,
  replaceDigit,
  recentlyYearMonth,
} from "@/utils/index";
export default {
  components: {
    bulk,
    Check,
  },
  dicts: ["sys_account_status"],
  directives: {
    print,
  },
  data() {
    return {
      year: "",
      headForm: {
        tableCode: "", // 表号
        enactingOrgan: "", // 制定机关
        approvalOrgan: "", // 批准机关
        approvalDocumentNum: "", // 批准文号
        periodOfValidity: "", // 有效期
      },
      listform: {
        principalUnit: "",
        principalStatistics: "",
        formPepole: "",
        phone: "",
        date: "",
        list: deepClone(tableConst.tableData),
      },
      listRules: {
        value: [{ required: true, message: "不能为空", trigger: "blur" }],
      },
      queryParams: {
        // organizationStructureCode: "",
        unifiedSocialCreditCode: "",
        companyName: "",
        month: "",
        id: null,
      },
      organizAndsocialList: [],
      inputList: [],
      restaurants: [],
      yearMonthList: [],
      yearMonthChose: null,
      pickerOptions: {
        disabledDate: (time) => {
          const timeYear = time.getFullYear(); //  将el-date-picker选择器转化为年份
          let timeMonth = time.getMonth() + 1; //  将el-date-picker选择器时间转化为月份
          if (timeMonth >= 1 && timeMonth <= 9) {
            // 为1-9月前加上0  比如: 03
            timeMonth = "0" + timeMonth;
          }
          const timeDate = timeYear.toString() + "-" + timeMonth.toString(); // 将年份和月份拼接 会自动进行循环  自动拼接el-date-picker选择器的时间
          /**
           * 可以取区间值
           * 也可以某年某月之前或者之后
           * timeDate 选择器时间
           */
          let datelist = [];
          datelist = recentlyYearMonth(24);
          return (
            timeDate < datelist[datelist.length - 1] || timeDate > datelist[0]
          );
        },
      },
      explain: tableConst.explain,
      show: false,
      modelName: "",
      id: "",
      readyStaus: null,
      checkVisible: false,
      checkId: null,
      verifyMessage: null, // 审核意见
      monthEmeterReqVoList: [],
      printObj: {
        id: "month-form-table", // 这里是要打印元素的ID
        popTitle: "&nbsp", // 打印的标题
        extraCss: "", // 打印可引入外部的一个 css 文件
        extraHead: "", // 打印头部文字
      },
      administrativeDivision: null,
      userId: null,
    };
  },
  created() {
    this.getYeartoshow();
    this.getSelectins();
    this.initialize();
  },
  mounted() {
    this.administrativeDivision = this.$store.state.user.administrativeDivision; // 获取本身的行政规划
    this.userId = this.$store.state.user.id; // 获取本身的ID判断是不是超级管理员
  },
  methods: {
    async initialize() {
      const aa = await this.listformReset();
      const bb = await this.queryParamsReset();
      const cc = await this.headFormReset();
      const dd = await this.getyearMonth();
      const ee = await this.getTabsdata();
    },
    getYeartoshow() {
      let date = new Date();
      let year = date.getFullYear().toString();
      this.year = year.slice(2);
    },
    //* 获取前24个月-选取前一个月
    getyearMonth() {
      this.yearMonthList = recentlyYearMonth(24);
      this.yearMonthChose = this.yearMonthList[0];
      this.queryParams.month = this.yearMonthChose;
    },
    // 获取当月4tab数据和表尾数据
    getTabsdata() {
      let params = {
        month: this.queryParams.month,
      };
      postTabdata(params)
        .then((res) => {
          if (res.code === 700) {
            this.$message.warning(res.msg);
            return false;
          } else {
            if (res.code === 200) {
              // 4tab统计数据
              let perAccount = res?.data?.perAccount;
              this.perAccountDeal(perAccount);
              // 表尾数据
              let tail = res?.data?.statisticsInfo;
              this.tailDeal(tail);
            }
          }
        })
        .catch((err) => {
          // this.$message.error("系统错误,请联系管理员!20046");
        });
    },
    // 获取所有结构编码 信用编码，单位名称
    getSelectins() {
      postSelectins({})
        .then((res) => {
          if (res.code === 700) {
            this.$message.warning(res.msg);
            return false;
          } else {
            if (res.code == 200) {
              let list = res?.data;
              this.inputList = [];
              if (list.length > 0) {
                list.map((item) => {
                  let obj = {
                    id: item.id,
                    // organiz: item?.organizationStructureCode ?? "",
                    social: item.unifiedSocialCreditCode,
                    companyName: item.companyName,
                  };
                  this.inputList.push(obj);
                });
              }
            }
          }
        })
        .catch((err) => {
          // this.$message.error("系统错误,请联系管理员!20045");
        });
    },
    perAccountDeal(data) {
      if (data) {
        this.$emit("dataTotab", data);
      }
    },
    paramsDeal(params) {
      params.companyName = this.queryParams.companyName;
      // params.organizationStructureCode =
      //   this.queryParams.organizationStructureCode;
      params.unifiedSocialCreditCode = this.queryParams.unifiedSocialCreditCode;
      params.id = this.queryParams.id;
      params.month = this.queryParams.month;
      // params.status = this.readyStaus;
      return params;
    },
    listformReset() {
      this.listform = {
        principalUnit: "",
        principalStatistics: "",
        formPepole: "",
        phone: "",
        date: "",
        list: deepClone(tableConst.tableData),
      };
    },
    queryParamsReset() {
      this.queryParams = {
        // organizationStructureCode: "",
        unifiedSocialCreditCode: "",
        companyName: "",
        month: "",
        id: null,
      };
    },
    headFormReset() {
      this.headForm = {
        tableCode: "", // 表号
        enactingOrgan: "", // 制定机关
        approvalOrgan: "", // 批准机关
        approvalDocumentNum: "", // 批准文号
        periodOfValidity: "", // 有效期
      };
    },
    async initData() {
      if (this.queryParams.id == null || this.queryParams.id == "") {
        this.$message({
          message: "请从输入下拉选项中选择一项再进行搜索！",
          type: "warning",
        });
        return false;
      } else {
        this.headFormReset();
        this.listformReset();
        let p = {};
        let params = this.paramsDeal(p);
        await postInstitutionslist(params)
          .then((res) => {
            if (res.code === 700) {
              this.$message.warning(res.msg);
              return false;
            }
            // 状态
            this.readyStaus = res?.data?.status;
            // 表格内数据（需处理解析）
            let tableList = res?.data?.monthEmeterReqVoList;
            this.tableListDeal(tableList);
            // 表头数据
            let head = res?.data?.institutionsInfoVo;
            this.headDeal(head);
          })
          .catch((err) => {
            // this.$message.error("系统错误,请联系管理员!20040");
          });
      }
    },
    // 表格数据处理
    tableListDeal(list) {
      // 假数据
      // list = [
      //   { code: "009", value: "45" },
      //   { code: "102", value: "10" },
      //   { code: "111", value: "1719" },
      //   { code: "110", value: "3116" },
      // ];
      if (list != null && list.length > 0) {
        list.map((pig) => {
          this.listform.list.map((item) => {
            if (pig.code == item.code) {
              item.value = pig.value;
            }
            if (item.children && item.children.length > 0) {
              item.children.map((tig) => {
                if (pig.code == tig.code) {
                  tig.value = pig.value;
                }
              });
            }
          });
        });
      }
    },
    // 表头处理
    headDeal(head) {
      if (head != null) {
        this.headForm.tableCode = head.tableCode;
        this.headForm.enactingOrgan = head.enactingOrgan;
        this.headForm.approvalOrgan = head.approvalOrgan;
        this.headForm.approvalDocumentNum = head.approvalDocumentNum;
        this.headForm.periodOfValidity = head.periodOfValidity;
      }
    },
    // 表尾处理
    tailDeal(tail) {
      if (tail != null) {
        this.listform.principalUnit = tail?.principalUnit;
        this.listform.principalStatistics = tail?.principalStatistics;
        this.listform.formPepole = tail?.formPepole;
        this.listform.phone = tail?.phone;
        this.listform.date =
          "20" + tail?.year + "年" + tail?.month + "月" + tail?.day + "日";
      }
    },
    querySearch(queryString, cb, flage) {
      var restaurants = this.inputList;
      var results = queryString
        ? restaurants.filter(this.createFilter(queryString, flage))
        : restaurants;
      // 调用 callback 返回建议列表的数据
      let fnish = [];
      if (results.length > 0) {
        results.map((item) => {
          let obj = {
            id: item.id,
            value: item[flage],
          };
          fnish.push(obj);
        });
      }
      cb(fnish);
    },
    createFilter(queryString, flage) {
      return (restaurant) => {
        return restaurant[flage].indexOf(queryString) === 0;
      };
    },
    // 三级联动赋值查询
    handleSelect(tig) {
      if (this.inputList.length > 0) {
        this.inputList.map((item) => {
          if (tig.id == item.id) {
            // this.queryParams.organizationStructureCode = item.organiz;
            this.queryParams.unifiedSocialCreditCode = item.social;
            this.queryParams.companyName = item.companyName;
            this.queryParams.id = item.id;
          }
        });
      }
    },
    // 将有value的表格数据取出
    monthListdeal() {
      let arr = [];
      let num = 0;
      this.listform.list.map((item) => {
        if (item.value != null && item.value != "") {
          let obj = {
            code: item.code,
            value: item.value,
          };
          arr.push(obj);
        } else {
          num++;
        }
        if (item.children && item.children.length > 0) {
          item.children.map((tig) => {
            if (tig.value != null && tig.value != "") {
              let obj2 = {
                code: tig.code,
                value: tig.value,
              };
              arr.push(obj2);
            } else {
              num++;
            }
          });
        }
      });
      if (num != 0) {
        return [];
      } else {
        return arr;
      }
    },
    // 表格输入框输入限制 正整数 ,两位小数
    handleInput(val) {
      this.listform.list.map((item) => {
        if (item.value != null && item.value != "" && item.value != "0") {
          if (item.type == 0) {
            item.value = replaceDigit(Number(item.value), 2).toString();
          } else if (item.type == 1) {
            item.value = replaceInteger(Number(item.value)).toString();
          }
        }
        if (item.children && item.children.length > 0) {
          item.children.map((tig) => {
            if (tig.value != null && tig.value != "" && item.value != "0") {
              if (item.type == 0) {
                item.value = replaceDigit(Number(item.value), 2).toString();
              } else if (item.type == 1) {
                item.value = replaceInteger(Number(item.value)).toString();
              }
            }
          });
        }
      });
    },
    // 选择月份
    choseMonth() {
      // console.log(this.queryParams.month);
    },
    /* ...................................按钮区域.................................... */
    // 搜索
    handleQuery() {
      this.getTabsdata();
      this.initData();
    },
    // 重置
    handleresetQuery() {
      this.initialize();
      this.readyStaus = null;
    },
    // 保存
    handleSave(flag) {
      this.monthEmeterReqVoList = this.monthListdeal();
      if (this.monthEmeterReqVoList.length == 0) {
        this.$message.warning("表格内配置数量不能为空");
        return false;
      }
      let params = {
        id: this.queryParams.id,
        month: this.queryParams.month,
        monthEmeterReqVoList: this.monthEmeterReqVoList,
      };
      postAddsave(params)
        .then((res) => {
          if (res.code === 700) {
            this.$message.warning(res.msg);
            return false;
          }
          if (flag == 1) {
            this.$message({
              type: "success",
              message: "保存成功!",
            });
            this.handleQuery();
          } else if (flag == 2) {
            this.requestUp();
          }
        })
        .catch((err) => {
          // this.$message.error("系统错误,请联系管理员!200481");
        });
    },
    // 保存&&提交
    saveAndup() {
      this.handleSave(2);
    },
    // 提交
    handleUp() {
      this.$confirm("确认提交该表单吗?", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning",
      })
        .then(() => {
          this.saveAndup();
        })
        .catch(() => {
          this.$message({
            type: "info",
            message: "已取消",
          });
        });
    },
    // todo 提交请求
    requestUp() {
      let params = {
        id: this.queryParams.id,
        month: this.queryParams.month,
      };
      postSubmit(params)
        .then((res) => {
          if (res.code === 700) {
            this.$message.warning(res.msg);
            return false;
          }
          this.$message({
            type: "success",
            message: "提交成功!",
          });
          this.handleQuery();
        })
        .catch((err) => {
          // this.$message.error("系统错误,请联系管理员!200482");
        });
    },
    // 审核
    handleImport() {
      this.getAuditmsg();
      setTimeout(() => {
        this.checkVisible = true;
        this.checkId = this.queryParams.id;
        // 将有value 的表格数据传递
        // this.monthEmeterReqVoList = this.monthListdeal();
      }, 500);
    },
    // todo 查询审核信息
    getAuditmsg() {
      let params = {
        id: this.queryParams.id,
        month: this.queryParams.month,
      };
      postAuditdetail(params)
        .then((res) => {
          if (res.code === 700) {
            this.$message.warning(res.msg);
            return false;
          }
          this.verifyMessage = res?.data?.comments ?? "";
        })
        .catch((err) => {
          // this.$message.error("系统错误,请联系管理员!200482");
        });
    },
    // 确认
    handleConfirm() {
      this.getAuditmsg();
      setTimeout(() => {
        this.$confirm(
          "驳回原因为" + this.verifyMessage + "，是否确认？",
          "提示",
          {
            confirmButtonText: "是",
            cancelButtonText: "否",
            type: "warning",
          }
        )
          .then(() => {
            this.reportConfirm();
          })
          .catch(() => {
            this.$message({
              type: "info",
              message: "已取消",
            });
          });
      }, 500);
    },
    // todo 确认请求
    reportConfirm() {
      let params = {
        id: this.queryParams.id,
        month: this.queryParams.month,
      };
      postConfirm(params)
        .then((res) => {
          if (res.code === 700) {
            this.$message.warning(res.msg);
            return false;
          }
          this.$message({
            type: "success",
            message: "已确认!",
          });
          this.handleQuery();
        })
        .catch((err) => {
          // this.$message.error("系统错误,请联系管理员!200483");
        });
    },
    // 上报
    handleReport() {
      this.$confirm("确认上报该表单吗?", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning",
      })
        .then(() => {
          this.requestReport();
        })
        .catch(() => {
          this.$message({
            type: "info",
            message: "已取消",
          });
        });
    },
    // todo 上报请求
    requestReport() {
      const params = {
        id: this.queryParams.id,
        month: this.queryParams.month,
      };
      postReport(params)
        .then((res) => {
          if (res.code === 700) {
            this.$message.warning(res.msg);
            return false;
          }
          this.$message({
            type: "success",
            message: "上报成功!",
          });
          this.handleQuery();
        })
        .catch((err) => {
          // this.$message.error("系统错误,请联系管理员!20043");
        });
    },
    // 打印
    handlePrint() {
      console.log("打印");
    },
    // 导出
    handleExport() {
      const params = {
        id: this.queryParams.id,
        month: this.queryParams.month,
      };
      exportExecl(
        this.queryParams.companyName +
          "_公共机构能源资源消费状况_" +
          this.queryParams.month,
        "/system/institutionsIndex/export",
        params,
        this,
        ".pdf"
      );
    },
    // 弹窗
    // showModel(name, params) {
    //   this.modelName = name;
    //   if (name == "") {
    //     this.id = params.id || "";
    //   } else if (name == "bulk") {
    //     this.id = "bulk2";
    //   }
    //   setTimeout(() => {
    //     this.show = true;
    //   }, 200);
    // },
    // close(status) {
    //   this.show = false;
    //   setTimeout(() => {
    //     if (status) this.handlerSearchDetail();
    //   }, 200);
    // },
  },
};
</script>

<style lang="scss" scoped>
/* 解决el-table列打印显示不全 */
::v-deep #pagetable table {
  table-layout: auto !important;
}
::v-deep .el-table__header-wrapper .el-table__header {
  width: 100% !important;
}
::v-deep .el-table__body-wrapper .el-table__body {
  width: 100% !important;
}

.table-content {
  height: 500px;
}
.table-border-line {
  border-top: 4px solid #d2d2d8;
  border-bottom: 4px solid #d2d2d8;
  // padding: 20px 0 10px 0;
  // padding-top: 10px;
  margin-bottom: 10px;
}
.table-title-area {
  // text-align: center;
  display: flex;
  align-items: center;
  justify-content: center;
  .table-title {
    font-family: SourceHanSansSC;
    font-weight: 400;
    font-size: 28px;
    color: rgb(16, 16, 16);
    font-style: normal;
    letter-spacing: 0px;
    line-height: 40px;
    text-decoration: none;
  }
}

.single-label {
  height: 28px;
  margin: 2px;
}
.single-down {
  height: 160px;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  .down-label {
    height: 28px;
    // margin-top: 112px;
  }
}
.cellCenter {
  margin-top: 20px;
  .el-input {
    width: 100px;
  }
}
</style>
